"use strict";

var $ = require("jquery"),
    commonUtils = require("core/utils/common");

require("common.css!");
require("generic_light.css!");
require("ui/data_grid/pager");

var PAGER_LIGHT_MODE_WIDTH = 200;

QUnit.testStart(function() {
    var markup = '<div id="container"></div>';

    $("#qunit-fixture").html(markup);
});

function getText(element) {
    return $(element).text();
}

QUnit.module("Pager", {
    beforeEach: function() {
        this.checkPages = function(pages, values, selectedValue) {
            var i,
                value,
                element;

            if(pages.length !== values.length) {
                return false;
            }

            for(i = 0; i < pages.length; i++) {
                element = pages[i]._$page[0];
                value = getText(element);
                if(value !== String(values[i])) {
                    return false;
                }
                if(element.className.indexOf("dx-selection") > -1 && value !== selectedValue) {
                    return false;
                }
            }
            return true;
        };
    }
});

var getPagesElement = function(rootElement) {
    return rootElement.find(".dx-pages")[0].childNodes;
};

QUnit.test("Default options init", function(assert) {
    var $pager = $("#container").dxPager(),
        instance = $pager.data("dxPager");

    assert.ok(instance.option("visible"), "visible");
    assert.equal(instance.option("pageIndex"), 1, "pageIndex");
    assert.equal(instance.option("maxPagesCount"), 10, "maxPagesCount");
    assert.equal(instance.option("pageCount"), 10, "pageCount");
    assert.equal(instance.option("pageSize"), 5, "pageSize");
    assert.deepEqual(instance.option("pageSizes"), [5, 10], "pageSizes");
    assert.ok(instance.option("hasKnownLastPage"), "hasKnownLastPage");
    assert.deepEqual(instance.option("pageIndexChanged"), $.noop, "pageIndexChanged");
    assert.deepEqual(instance.option("pageSizeChanged"), $.noop, "pageSizeChanged");
});

QUnit.test("Markup init", function(assert) {
    var $pager = $("#container").dxPager(),
        $pageSizeButton = $pager.find(".dx-page-size").first(),
        $pageNumberButton = $pager.find(".dx-page").eq(2);

    assert.ok($pager.hasClass("dx-pager"), "pager class");
    assert.ok($pager.css("display") !== "none", "element is visible");

    assert.ok($pager.find(".dx-pages").length === 1, "pages chooser element");
    assert.equal($pager.find(".dx-page").length, 10, "page elements count");

    assert.equal($pager.find(".dx-page-sizes").length, 1, "page sizes element");
    assert.equal($pager.find(".dx-page-size").length, 2, "page size elements");

    assert.equal($pager.find(".dx-pages" + " ." + "dx-selection").length, 1, "page selection");
    assert.equal($pager.find(".dx-page-sizes" + " ." + "dx-selection").length, 1, "page size selection");

    assert.equal($pageSizeButton.attr("role"), "button", "Page size element has correct role");
    assert.equal($pageNumberButton.attr("role"), "button", "Page number element has correct role");

    assert.equal($pageSizeButton.attr("aria-label"), "Display 5 items on page", "Page size element has correct aria-label");
    assert.equal($pageNumberButton.attr("aria-label"), "Page 3", "Page number element has correct aria-label");
});

QUnit.test("Events are called", function(assert) {
    var $pager = $("#container").dxPager({
            pageIndexChanged: function(pageIndex) {
                testPageIndex = pageIndex;
            },
            pageSizeChanged: function(pageSize) {
                testPageSize = pageSize;
            }
        }),
        testPageIndex = null,
        testPageSize = null;

    $($pager.find(".dx-page")[1]).trigger("dxclick");
    assert.equal(testPageIndex, 2, "pageIndex is changed");

    $($pager.find(".dx-page-size")[1]).trigger("dxclick");
    assert.equal(testPageSize, 10, "pageSize is changed");
});

QUnit.test("Markup when a pages count less max pages count", function(assert) {
    var $pager = $("#container").dxPager({ pageCount: 15 });

    assert.equal($pager.find(".dx-page").length, 6, "page elements count");
    assert.ok($pager.find(".dx-separator").length === 1, "page separator element");

    assert.equal($pager.find(".dx-page-sizes").length, 1, "page sizes element");
    assert.equal($pager.find(".dx-page-size").length, 2, "page size elements");

    assert.equal($pager.find(".dx-pages" + " ." + "dx-selection").length, 1, "page selection");
    assert.equal($pager.find(".dx-page-sizes" + " ." + "dx-selection").length, 1, "page size selection");
});

QUnit.test("Pager is not rendered if pages count equal zero", function(assert) {
    var $pager = $("#container").dxPager({ maxPagesCount: 7, pageCount: 0 });

    assert.ok($pager.find(".dx-pages").length === 0, 'pager is not rendered');
});

QUnit.test('Pager is rendered if pages count equals one and more page exists', function(assert) {
    var $pager = $("#container").dxPager({ maxPagesCount: 7, pageCount: 1, hasKnownLastPage: false }),
        instance = $pager.data("dxPager");

    assert.ok($pager.find(".dx-pages").length === 1, 'pager is rendered');
    assert.ok(this.checkPages(instance._pages, [1, '>'], "1"), 'pages');
});

QUnit.test('Pager second render', function(assert) {
    var $pager = $("#container").dxPager({ maxPagesCount: 7, pageCount: 5 }),
        instance = $pager.data("dxPager");

    instance._render();

    assert.equal($("." + "dx-pager").length, 1, 'drawn one pager only');
});


QUnit.test('Get pages when pages count more maxPagesCount', function(assert) {
    var $pager = $("#container").dxPager({ maxPagesCount: 10, pageCount: 13 }),
        instance = $pager.data("dxPager");

    assert.ok(this.checkPages(instance._pages, [1, 2, 3, 4, 5, 13], "1"), 'pages');
});

QUnit.test('Get pages when pages count more maxPagesCount and more page exists', function(assert) {
    var $pager = $("#container").dxPager({ maxPagesCount: 10, pageCount: 13, hasKnownLastPage: false }),
        instance = $pager.data("dxPager");

    assert.ok(this.checkPages(instance._pages, [1, 2, 3, 4, 5, 13, ">"], "1"), "pages");
});

//B232538
QUnit.test('Get pages when pages count more maxPagesCount after pages count is changed', function(assert) {
    var $pager = $("#container").dxPager({ maxPagesCount: 10, pageCount: 1 }),
        instance = $pager.data("dxPager");

    instance.option("pageCount", 13);

    assert.ok(this.checkPages(instance._pages, [1, 2, 3, 4, 5, 13], "1"), "pages");
});

QUnit.test('Get pages when more page does not exist after changed', function(assert) {
    var $pager = $("#container").dxPager({ maxPagesCount: 10, pageCount: 13, hasKnownLastPage: false }),
        instance = $pager.data("dxPager");

    instance.option({ pageCount: 14, hasKnownLastPage: true });

    assert.ok(this.checkPages(instance._pages, [1, 2, 3, 4, 5, 14], "1"), "pages");
});

QUnit.test('Get pages when pages count less maxPagesCount', function(assert) {
    var $pager = $("#container").dxPager({ maxPagesCount: 10, pageCount: 7 }),
        instance = $pager.data("dxPager");

    assert.ok(this.checkPages(instance._pages, [1, 2, 3, 4, 5, 6, 7], "1"), 'pages');
});

QUnit.test('SelectPageByValue', function(assert) {
    var $pager = $("#container").dxPager({ maxPagesCount: 10, pageCount: 13 }),
        instance = $pager.data("dxPager"),
        pages = instance._pages;

    //assert
    assert.ok(this.checkPages(pages, [1, 2, 3, 4, 5, 13], "1"), "page value = 1");
    instance._selectPageByValue(2);
    assert.ok(this.checkPages(pages, [1, 2, 3, 4, 5, 13], "2"), "page value = 2");
    instance._selectPageByValue(3);
    assert.ok(this.checkPages(pages, [1, 2, 3, 4, 5, 13], "3"), "page value = 3");
    instance._selectPageByValue(4);
    assert.ok(this.checkPages(pages, [1, 2, 3, 4, 5, 13], "4"), "page value = 4");
    instance._selectPageByValue(5);
    assert.ok(this.checkPages(pages, [1, 3, 4, 5, 6, 13], "5"), "page value = 5");
    instance._selectPageByValue(6);
    assert.ok(this.checkPages(pages, [1, 4, 5, 6, 7, 13], "6"), "page value = 6");
    instance._selectPageByValue(7);
    assert.ok(this.checkPages(pages, [1, 5, 6, 7, 8, 13], "7"), "page value = 7");
    instance._selectPageByValue(8);
    assert.ok(this.checkPages(pages, [1, 6, 7, 8, 9, 13], "8"), "page value = 8");
    instance._selectPageByValue(9);
    assert.ok(this.checkPages(pages, [1, 7, 8, 9, 10, 13], "9"), "page value = 9");
    instance._selectPageByValue(10);
    assert.ok(this.checkPages(pages, [1, 8, 9, 10, 11, 13], "10"), "page value = 10");
    instance._selectPageByValue(11);
    assert.ok(this.checkPages(pages, [1, 9, 10, 11, 12, 13], "11"), "page value = 11");
    instance._selectPageByValue(1);
    assert.ok(this.checkPages(pages, [1, 2, 3, 4, 5, 13], "1"), "page value = 1");
    instance._selectPageByValue(13);
    assert.ok(this.checkPages(pages, [1, 9, 10, 11, 12, 13], "13"), "page value = 13");
});

QUnit.test('Render pages without separator', function(assert) {
    var testElement = $("#container");
    testElement.dxPager({ maxPagesCount: 7, pageCount: 5 });
    var pagesElement = getPagesElement(testElement);

    assert.equal(pagesElement.length, 5, 'pages elements count');
    assert.equal(getText(pagesElement[0]), '1', 'page 1');
    assert.equal(getText(pagesElement[1]), '2', 'page 2');
    assert.equal(getText(pagesElement[2]), '3', 'page 3');
    assert.equal(getText(pagesElement[3]), '4', 'page 4');
    assert.equal(getText(pagesElement[4]), '5', 'page 5');
});

QUnit.test('Render pages with separator', function(assert) {
    var testElement = $('#container');
    testElement.dxPager({ maxPagesCount: 7, pageCount: 8 });
    var pagesElement = getPagesElement(testElement);

    assert.equal(pagesElement.length, 7, 'pages elements count');
    assert.equal(getText(pagesElement[0]), '1', 'page 1');
    assert.equal(getText(pagesElement[1]), '2', 'page 2');
    assert.equal(getText(pagesElement[2]), '3', 'page 3');
    assert.equal(getText(pagesElement[3]), '4', 'page 4');
    assert.equal(getText(pagesElement[4]), '5', 'page 5');
    assert.equal(getText(pagesElement[5]), '. . .', 'separator');
    assert.equal(getText(pagesElement[6]), '8', 'last page');
});

QUnit.test('Select page after click', function(assert) {
    var testElement = $('#container'),
        $pager = testElement.dxPager({ maxPagesCount: 7, pageCount: 8 }),
        instance = $pager.data("dxPager"),
        pagesElement;

    instance._pages[4]._$page.trigger("dxclick");

    pagesElement = getPagesElement(testElement);
    assert.equal(pagesElement.length, 8, 'pages elements count');
    assert.equal(getText(pagesElement[0]), '1', 'page 1');
    assert.equal(getText(pagesElement[1]), '. . .', 'separator');
    assert.equal(getText(pagesElement[2]), '3', 'page 2');
    assert.equal(getText(pagesElement[3]), '4', 'page 3');
    assert.equal(getText(pagesElement[4]), '5', 'page 4');
    assert.equal(getText(pagesElement[5]), '6', 'page 4');
    assert.equal(getText(pagesElement[6]), '. . .', 'separator');
    assert.equal(getText(pagesElement[7]), '8', 'last page');
});

QUnit.test("PagesChooser is not visible if pages count equal one", function(assert) {
    var testElement = $('#container'),
        $pages;


    testElement.dxPager({ maxPagesCount: 7, pageCount: 1 });
    $pages = testElement.find(".dx-page");

    assert.equal($pages.length, 1, '$pages count');
    assert.equal($pages.css("visibility"), "hidden");
});

QUnit.test("PagesChooser is visible always if pageNavigatorVisible is true", function(assert) {
    var testElement = $('#container'),
        $pages;


    testElement.dxPager({ maxPagesCount: 7, pageCount: 1, pagesNavigatorVisible: true });
    $pages = testElement.find(".dx-page");

    assert.equal($pages.length, 1, '$pages count');
    assert.ok($pages.css("visibility") !== "hidden");
});

QUnit.test("PagesChooser is not visible  if pageNavigatorVisible is false", function(assert) {
    var testElement = $('#container'),
        $pages;


    testElement.dxPager({ maxPagesCount: 7, pageCount: 1, pagesNavigatorVisible: false });
    $pages = testElement.find(".dx-page");

    assert.equal($pages.length, 0, '$pages count');
});

QUnit.test("PagesChooser is not visible when pageNavigatorVisible is false", function(assert) {
    var testElement = $('#container'),
        pager,
        $pages;


    pager = testElement.dxPager({ maxPagesCount: 7, pageCount: 1, pagesNavigatorVisible: true }).data("dxPager");
    pager.option("pagesNavigatorVisible", false);
    $pages = testElement.find(".dx-page");

    assert.equal($pages.length, 0, '$pages count');
});

QUnit.test('Change pages count', function(assert) {
    var testElement = $('#container'),
        $pager = testElement.dxPager({ maxPagesCount: 7, pageCount: 8 }),
        instance = $pager.data("dxPager"),
        pagesElement;

    instance._pages[4]._$page.trigger("dxclick");

    pagesElement = getPagesElement(testElement);
    assert.equal(instance.selectedPage.value(), '5', 'selected page');
    assert.equal(pagesElement.length, 8, 'pages elements count');
    assert.equal(getText(pagesElement[0]), '1', 'page 1');
    assert.equal(getText(pagesElement[1]), '. . .', 'separator');
    assert.equal(getText(pagesElement[2]), '3', 'page 2');
    assert.equal(getText(pagesElement[3]), '4', 'page 3');
    assert.equal(getText(pagesElement[4]), '5', 'page 4');
    assert.equal(getText(pagesElement[5]), '6', 'page 4');
    assert.equal(getText(pagesElement[6]), '. . .', 'separator');
    assert.equal(getText(pagesElement[7]), '8', 'last page');

    instance.option("pageCount", 9);

    pagesElement = getPagesElement(testElement);
    assert.equal(instance.selectedPage.value(), '5', 'selected page');
    assert.equal(pagesElement.length, 8, 'pages elements count');
    assert.equal(getText(pagesElement[0]), '1', 'page 1');
    assert.equal(getText(pagesElement[1]), '. . .', 'separator');
    assert.equal(getText(pagesElement[2]), '3', 'page 2');
    assert.equal(getText(pagesElement[3]), '4', 'page 3');
    assert.equal(getText(pagesElement[4]), '5', 'page 4');
    assert.equal(getText(pagesElement[5]), '6', 'page 4');
    assert.equal(getText(pagesElement[6]), '. . .', 'separator');
    assert.equal(getText(pagesElement[7]), '9', 'last page');
});

QUnit.test('render pager on changed event', function(assert) {
    var $pager = $("#container").dxPager({ maxPagesCount: 8, pageCount: 0 }),
        instance = $pager.data("dxPager");

    assert.strictEqual($(".dx-pages").length, 0);

    instance.option("pageCount", 10);

    assert.strictEqual($(".dx-pages").length, 1);
});

QUnit.test('Pager is not displayed when visible is false', function(assert) {
    var $pager = $("#container").dxPager({ maxPagesCount: 8, pageCount: 10, pageSizes: [5, 10, 20], visible: false });

    assert.ok($("." + "dx-pager").length === 1, 'pager is rendered');
    assert.equal($pager.css("display"), "none", "pager is hidden");
});

QUnit.test('Page sizes render', function(assert) {
    $("#container").dxPager({ maxPagesCount: 8, pageCount: 10, pageIndex: 1, pageSizes: [5, 10, 20] });
    var pageSizesElements = $(".dx-page-size");

    assert.equal(pageSizesElements.length, 3, 'page size elements count');
    assert.equal(getText(pageSizesElements[0]), 5, 'page size = 5');
    assert.equal(getText(pageSizesElements[1]), 10, 'page size = 10');
    assert.equal(getText(pageSizesElements[2]), 20, 'page size = 20');
});

QUnit.test('Page sizes render when pageSizes is false', function(assert) {
    $("#container").dxPager({ maxPagesCount: 8, pageCount: 10, pageIndex: 1, pageSizes: false });

    var pageSizesElements = $(".dx-page-size"),
        pageSizesContainer = $(".dx-page-sizes");

    assert.equal(pageSizesContainer.length, 0, 'page sizes container elements count');
    assert.equal(pageSizesElements.length, 0, 'page size elements count');
});

QUnit.test('Page sizes render when showPageSizes is false', function(assert) {
    $("#container").dxPager({ maxPagesCount: 8, pageCount: 10, pageIndex: 1, showPageSizes: false, pageSizes: [5, 10, 20] });

    var pageSizesElements = $(".dx-page-size"),
        pageSizesContainer = $(".dx-page-sizes");

    assert.equal(pageSizesContainer.length, 0, 'page sizes container elements count');
    assert.equal(pageSizesElements.length, 0, 'page size elements count');
});

QUnit.test('Page size selection by click', function(assert) {
    $("#container").dxPager({ maxPagesCount: 8, pageCount: 10, pageIndex: 1, pageSizes: [5, 10, 20] });

    var pageSizesElements = $(".dx-page-size"),
        selectionPageSizesElements,
        cssSelectionClassName = ".dx-page-size" + "." + "dx-selection";

    pageSizesElements.eq(0).trigger("dxclick");
    selectionPageSizesElements = $(cssSelectionClassName);

    //assert
    assert.equal(selectionPageSizesElements.length, 1, 'page size elements count');
    assert.equal(getText(selectionPageSizesElements[0]), '5', 'page size = 5');

    //act
    pageSizesElements = $(".dx-page-size");
    pageSizesElements.eq(2).trigger("dxclick");
    selectionPageSizesElements = $(cssSelectionClassName);

    //assert
    assert.equal(selectionPageSizesElements.length, 1, 'page size elements count');
    assert.equal(getText(selectionPageSizesElements[0]), '20', 'page size = 20');

    //act
    pageSizesElements = $(".dx-page-size");
    pageSizesElements.eq(1).trigger("dxclick");
    selectionPageSizesElements = $(cssSelectionClassName);

    //assert
    assert.equal(selectionPageSizesElements.length, 1, 'page size elements count');
    assert.equal(getText(selectionPageSizesElements[0]), '10', 'page size = 10');
});

QUnit.test('Page size is changed when selected page is clicked', function(assert) {
    var pageSizeChanged;

    $("#container").dxPager({
        maxPagesCount: 8,
        pagesCount: 10,
        pageIndex: 1,
        pageSizes: [5, 10, 20],
        pageSizeChanged: function() {
            pageSizeChanged = true;
        }
    });

    var pageSizesElements = $(".dx-page-size");

    pageSizesElements.eq(1).trigger("dxclick");
    assert.ok(pageSizeChanged);

    pageSizeChanged = false;

    pageSizesElements.eq(1).trigger("dxclick");
    assert.ok(!pageSizeChanged);
});

QUnit.test('PageSizeChanged is occurred when page size option is changed', function(assert) {
    var pageSizeChanged,
        $pager = $("#container").dxPager({
            maxPagesCount: 8,
            pagesCount: 10,
            pageIndex: 1,
            pageSizes: [5, 10, 20],
            pageSizeChanged: function() {
                pageSizeChanged = true;
            }
        }),
        pager = $pager.dxPager("instance");

    assert.ok(!pageSizeChanged);

    pager.option("pageSize", 20);

    assert.ok(pageSizeChanged);
});

QUnit.test('Correct selected page when page index is not contains in the pages', function(assert) {
    var $pager = $("#container").dxPager({ maxPagesCount: 8, pageCount: 25, pageIndex: 1, pageSizes: [5, 10, 20] }),
        instance = $pager.data("dxPager");

    instance.option("pageIndex", 16);

    assert.equal(instance._pages[1].value(), 15, '1 page value');
    assert.equal(instance._pages[1].index, 1, '1 page index');
    assert.equal(instance._pages[2].value(), 16, '2 page value');
    assert.equal(instance._pages[2].index, 2, '1 page index');
    assert.equal(instance._pages[3].value(), 17, '3 page value');
    assert.equal(instance._pages[3].index, 3, '1 page index');
    assert.equal(instance._pages[4].value(), 18, '4 page value');
    assert.equal(instance._pages[4].index, 4, '1 page index');
    assert.ok(instance._pages[2]._$page.hasClass("dx-page"), 'page is selected');

    instance.option("pageIndex", 22);

    assert.equal(instance._pages[1].value(), 21, '1 page value');
    assert.equal(instance._pages[1].index, 1, '1 page index');
    assert.equal(instance._pages[2].value(), 22, '2 page value');
    assert.equal(instance._pages[2].index, 2, '1 page index');
    assert.equal(instance._pages[3].value(), 23, '3 page value');
    assert.equal(instance._pages[3].index, 3, '1 page index');
    assert.equal(instance._pages[4].value(), 24, '4 page value');
    assert.equal(instance._pages[4].index, 4, '1 page index');
    assert.ok(instance._pages[3]._$page.hasClass("dx-page"), 'page is selected');
});

QUnit.test('Refresh pages after page size is changed_B233925', function(assert) {
    var $pager = $("#container").dxPager({ maxPagesCount: 8, pageCount: 15, pageIndex: 1, pageSizes: [5, 10, 20] }),
        instance = $pager.data("dxPager");

    instance.option("pageIndex", 13);
    instance.option("pageCount", 13);

    assert.equal(instance._pages[0].value(), 1, '1 page value');
    assert.equal(instance._pages[1].value(), 9, '2 page value');
    assert.equal(instance._pages[2].value(), 10, '3 page value');
    assert.equal(instance._pages[3].value(), 11, '4 page value');
    assert.equal(instance._pages[4].value(), 12, '5 page value');
    assert.equal(instance._pages[5].value(), 13, '6 page value');
});

//B239491
QUnit.test('Pager has negative pages when pages count is changed', function(assert) {
    var $pager = $("#container").dxPager({
            maxPagesCount: 8,
            pageCount: 1,
            pageIndex: 1,
            visible: false,
            hasKnownLastPage: false
        }),
        instance = $pager.data("dxPager");

    instance.option({
        hasKnownLastPage: true,
        pageCount: 1
    });

    instance.option({
        visible: true,
        pageCount: 25
    });

    assert.equal(instance.selectedPage.index, 0, '0 index selected page');
    assert.equal(instance._pages.length, 6, 'length 6');
    assert.equal(instance._pages[0].value(), 1, 'first page value');
    assert.equal(instance._pages[1].value(), 2, 'second page value');
});

QUnit.test('Selected page is not reset_B237051', function(assert) {
    var $pager = $("#container").dxPager({ maxPagesCount: 8, pageCount: 15, pageIndex: 1 }),
        instance = $pager.data("dxPager");

    instance.option("pageCount", 1);
    instance.option("pageCount", 15);

    assert.equal(instance._pages[0].value(), 1, '1 page value');
    assert.equal(instance._pages[1].value(), 2, '2 page value');
    assert.equal(instance._pages[2].value(), 3, '3 page value');
    assert.equal(instance._pages[3].value(), 4, '4 page value');
    assert.equal(instance._pages[4].value(), 5, '5 page value');
    assert.equal(instance._pages[5].value(), 15, '6 page value');
});

//B239176
QUnit.test('Click separator page_B239176', function(assert) {
    var $pager = $("#container").dxPager({ maxPagesCount: 7, pageCount: 8 }),
        instance = $pager.data("dxPager");

    $(".dx-separator").first().trigger("dxclick");

    assert.ok(!commonUtils.isDefined(instance._testPageIndex));
});

//B239176
QUnit.test('Click  page parent container_B239176', function(assert) {
    var $pager = $("#container").dxPager({ maxPagesCount: 7, pageCount: 8 }),
        instance = $pager.data("dxPager");

    $(".dx-pages").first().trigger("dxclick");

    assert.ok(!commonUtils.isDefined(instance._testPageIndex));
});

//B239176
QUnit.test('Click page size parent container_B239176', function(assert) {
    var $pager = $("#container").dxPager({ maxPagesCount: 8, pageCount: 10, pageSizes: [5, 10, 20] }),
        instance = $pager.data("dxPager");

    $(".dx-page-sizes").first().trigger("dxclick");

    assert.ok(!commonUtils.isDefined(instance._testPageSizeIndex));
});

QUnit.test("Show navigate buttons", function(assert) {
    var $pager = $("#container").dxPager({ maxPagesCount: 8, pageCount: 10, pageSizes: [5, 10, 20], showNavigationButtons: true });

    assert.equal($pager.find(".dx-navigate-button").length, 2, "navigate buttons count");
    assert.equal($pager.find(".dx-prev-button").length, 1, "prev button");
    assert.equal($pager.find(".dx-next-button").length, 1, "next button");
});

QUnit.test("Next page index via navigate button", function(assert) {
    var $pager = $("#container").dxPager({ maxPagesCount: 8, pageCount: 10, pageSizes: [5, 10, 20], showNavigationButtons: true }),
        instance = $pager.data("dxPager");

    instance._nextPage("next");
    instance._nextPage("next");
    instance._nextPage("next");

    assert.equal(instance.selectedPage.value(), "4", "page index");

    instance.option("pageIndex", 10);
    instance._nextPage("next");

    assert.equal(instance.selectedPage.value(), "10", "page index");
});

QUnit.test("Back page index via navigate button", function(assert) {
    var $pager = $("#container").dxPager({ maxPagesCount: 8, pageCount: 10, pageSizes: [5, 10, 20], showNavigationButtons: true }),
        instance = $pager.data("dxPager");

    instance.option("pageIndex", 8);
    instance._nextPage("prev");
    instance._nextPage("prev");

    assert.equal(instance.selectedPage.value(), "6", "page index");

    instance.option("pageIndex", 1);
    instance._nextPage("prev");

    assert.equal(instance.selectedPage.value(), "1", "page index");
});

QUnit.test("Click on navigate buttons", function(assert) {
    var $pager = $("#container").dxPager({ maxPagesCount: 8, pageCount: 10, pageSizes: [5, 10, 20], showNavigationButtons: true }),
        instance = $pager.data("dxPager"),
        $button,
        currentDirection;

    instance.option("pageIndex", 8);
    instance._nextPage = function(direction) {
        currentDirection = direction;
    };

    $button = $(".dx-next-button");
    $button.trigger("dxclick");
    assert.equal(currentDirection, "next");

    $button = $(".dx-prev-button");
    $button.trigger("dxclick");
    assert.equal(currentDirection, "prev");
});

QUnit.test("Prev button is disabled when first page is chosen ", function(assert) {
    var $pager = $("#container").dxPager({ maxPagesCount: 8, pageCount: 10, pageSizes: [5, 10, 20], showNavigationButtons: true }),
        isPageChanged,
        $button = $(".dx-prev-button"),
        instance = $pager.data("dxPager");

    instance.pageIndexChanged = function() {
        isPageChanged = true;
    };

    $button.click();

    assert.ok($button.hasClass("dx-button-disable"));
    assert.ok(!isPageChanged);
});

QUnit.test("Next button is disabled when first page is chosen ", function(assert) {
    var $pager = $("#container").dxPager({ maxPagesCount: 8, pageCount: 10, pageSizes: [5, 10, 20], showNavigationButtons: true }),
        isPageChanged,
        $button,
        instance = $pager.data("dxPager");

    instance.option("pageIndex", 10);
    instance.pageIndexChanged = function() {
        isPageChanged = true;
    };

    $button = $(".dx-next-button");
    $button.click();

    assert.ok($button.hasClass("dx-button-disable"));
    assert.ok(!isPageChanged);
});

QUnit.test("Next button is disabled when first page is chosen (Rtl mode)", function(assert) {
    $("#container").dxPager({
        maxPagesCount: 8,
        pageCount: 10,
        pageSizes: [5, 10, 20],
        showNavigationButtons: true,
        rtlEnabled: true
    });

    var $button = $(".dx-next-button");

    $button.click();

    assert.ok($button.hasClass("dx-button-disable"));
});

QUnit.test("Prev button is disabled when first page is chosen (Rtl mode)", function(assert) {
    var $pager = $("#container").dxPager({
            maxPagesCount: 8,
            pageCount: 10,
            pageSizes: [5, 10, 20],
            showNavigationButtons: true,
            rtlEnabled: true
        }),
        $button,
        instance = $pager.data("dxPager");

    instance.option("pageIndex", 10);

    $button = $(".dx-prev-button");
    $button.click();

    assert.ok($button.hasClass("dx-button-disable"));
});

QUnit.test("Pages chooser visibility when page size is changed", function(assert) {
    $("#container").dxPager({
        maxPagesCount: 8,
        pageCount: 10,
        pageIndex: 1,
        pageSize: 5,
        pageSizes: [5, 10, 20]
    });

    var pager = $("#container").dxPager("instance"),
        $pages = $(".dx-pages");

    assert.equal($pages[0].style.visibility, "", "default visibility");

    pager.option("pageCount", 1);

    $pages = $(".dx-pages");
    assert.equal($pages[0].style.visibility, "hidden", "visibility when pages count equal one");

    pager.option("pageCount", 8);

    $pages = $(".dx-pages");
    assert.equal($pages[0].style.visibility, "", "visibility when pages count equal 8");
});

QUnit.test("Pager Info", function(assert) {
    $("#container").dxPager({
        maxPagesCount: 8, pageCount: 10, pageSizes: [5, 10, 20], showInfo: true, totalCount: 86,
        infoText: "Page {0} of {1} ({2} items)"
    });

    var $info = $(".dx-info");

    assert.equal($info.length, 1, "info");
    assert.equal($info.text(), "Page 1 of 10 (86 items)", "info text");
});

QUnit.test("Page info text is changed when totalCount is changed", function(assert) {
    var $pager = $("#container").dxPager({
            maxPagesCount: 8, pageCount: 10, pageSizes: [5, 10, 20], showInfo: true, totalCount: 86,
            infoText: "Page {0} of {1} ({2} items)"
        }),
        instance = $pager.data("dxPager");

    instance.option("totalCount", 89);
    assert.equal($(".dx-info").text(), "Page 1 of 10 (89 items)");
});

QUnit.test("Light mode", function(assert) {
    var $pager = $("#container").width(PAGER_LIGHT_MODE_WIDTH).dxPager({
            maxPagesCount: 8,
            pageCount: 10,
            pageSizes: [5, 10, 20],
            showInfo: true,
            totalCount: 86,
            infoText: "Page {0} of {1} ({2} items)",
            pagesCountText: "of"
        }),
        $pageSizeChooser = $pager.find(".dx-page-sizes").children().first(),
        $pageIndex = $(".dx-page-index"),
        $pageInfoText = $(".dx-info-text"),
        $pagesCount = $(".dx-pages-count");

    assert.ok($pageSizeChooser.data("dxSelectBox"), "use selectBox for choose page sizes");
    assert.ok($pageIndex.data("dxNumberBox"), "use numberBox for page index");
    assert.equal($pageInfoText.text(), "of", "info text");
    assert.equal($pagesCount.text(), "10", "pages count");
    assert.equal($pager.find(".dx-navigate-button").length, 2, "navigate buttons count");
    assert.equal($pager.find(".dx-prev-button").length, 1, "prev button");
    assert.equal($pager.find(".dx-next-button").length, 1, "next button");
});

QUnit.test("Light mode without the page sizes and info", function(assert) {
    var $pager = $("#container").width(PAGER_LIGHT_MODE_WIDTH).dxPager({
            maxPagesCount: 8,
            pageCount: 10,
            pageSizes: [5, 10, 20],
            showInfo: false,
            showPageSizes: false,
            totalCount: 86,
            pagesCountText: "of"
        }),
        $pageSizeChooser = $pager.find(".dx-page-sizes").children().first(),
        $pageIndex = $(".dx-page-index"),
        $pageInfoText = $(".dx-info-text"),
        $pagesCount = $(".dx-pages-count");

    assert.ok(!$pageSizeChooser.data("dxSelectBox"), "use selectBox for choose page sizes");
    assert.ok($pageIndex.data("dxNumberBox"), "use numberBox for page index");
    assert.equal($pageInfoText.text(), "of", "info text");
    assert.equal($pagesCount.text(), "10", "pages count");
    assert.equal($pager.find(".dx-navigate-button").length, 2, "navigate buttons count");
    assert.equal($pager.find(".dx-prev-button").length, 1, "prev button");
    assert.equal($pager.find(".dx-next-button").length, 1, "next button");
});

QUnit.test("Light mode. Change page index after clicked on the pages count element", function(assert) {
    $("#container").width(PAGER_LIGHT_MODE_WIDTH).dxPager({
        maxPagesCount: 8,
        pageCount: 110,
        pageSizes: [5, 10, 20],
        showPageSizes: false,
        pagesCountText: "of"
    });

    var editor = $(".dx-page-index").data("dxNumberBox"),
        $pagesCount = $(".dx-pages-count");

    $pagesCount.trigger("dxclick");

    assert.equal($pagesCount.text(), "110", "pages count");
    assert.equal(editor.option("value"), 110, "value of editor in page index element");
});

QUnit.test("Light mode when re-render", function(assert) {
    var $pager = $("#container").width(PAGER_LIGHT_MODE_WIDTH).dxPager({
            maxPagesCount: 8,
            pageCount: 10,
            pageSizes: [5, 10, 20],
            pageSize: 10,
            showInfo: true,
            totalCount: 86,
            infoText: "Page {0} of {1} ({2} items)",
            pagesCountText: "of",
            showNavigationButtons: true
        }),
        $pageSizeChooser,
        $pageInfoText,
        $pageIndex,
        $pagesCount;

    $pager.data("dxPager")._render();

    $pageSizeChooser = $pager.find(".dx-page-sizes .dx-selectbox");
    $pageIndex = $(".dx-page-index");
    $pagesCount = $(".dx-pages-count");
    $pageInfoText = $(".dx-info-text"),

    assert.ok($pageSizeChooser.data("dxSelectBox").option("value"), 10, "page size");
    assert.ok($pageIndex.data("dxNumberBox").option("value"), 1, "page index");
    assert.equal($pageInfoText.text(), "of", "pages info text");
    assert.equal($pagesCount.text(), "10", "pages count");
});

QUnit.test("Light mode. Check page sizes", function(assert) {
    var $pager = $("#container").width(PAGER_LIGHT_MODE_WIDTH).dxPager({
            maxPagesCount: 8,
            pageCount: 10,
            pageSizes: [5, 10, 20],
            pageSize: 10,
            totalCount: 86,
            pagesCountText: "of"
        }),
        $pageSizeChooser = $pager.find(".dx-page-sizes").children().first(),
        selectBox = $pageSizeChooser.data("dxSelectBox");

    selectBox.open();

    assert.deepEqual(selectBox.option("items"), [5, 10, 20], "page sizes");
    assert.equal(selectBox.option("value"), 10, "current page size");

    selectBox.close();
});

QUnit.test("Light mode. Check page sizes width", function(assert) {
    var $pager = $("#container").width(PAGER_LIGHT_MODE_WIDTH).dxPager({
            maxPagesCount: 8,
            pageCount: 10,
            pageSizes: [5, 10, 20],
            pageSize: 10,
            totalCount: 86,
            pagesCountText: "of"
        }),
        pager = $pager.data("dxPager"),
        $pageSizeChooser = $pager.find(".dx-page-sizes").children().first(),
        selectBox = $pageSizeChooser.data("dxSelectBox");

    assert.equal(selectBox.option("width"), Number($(".dx-page-sizes").css("min-width").replace("px", "")) + 20);

    pager.option("pageSizes", [5, 10, 1010]);

    assert.equal(selectBox.option("width"), Number($(".dx-page-sizes").css("min-width").replace("px", "")) + 40);
});

QUnit.test("Light mode. Change page size", function(assert) {
    var testValue,
        $pager = $("#container").width(PAGER_LIGHT_MODE_WIDTH).dxPager({
            maxPagesCount: 8,
            pageCount: 10,
            pageSizes: [5, 10, 20],
            pageSize: 5,
            totalCount: 86,
            pagesCountText: "of",
            pageSizeChanged: function(value) {
                testValue = value;
            }
        }),
        $pageSizeChooser = $pager.find(".dx-page-sizes").children().first(),
        selectBox = $pageSizeChooser.data("dxSelectBox");

    selectBox.option("value", 20);

    assert.equal(testValue, 20);
});

QUnit.test("Light mode. Change page size via option method", function(assert) {
    var $pager = $("#container").width(PAGER_LIGHT_MODE_WIDTH).dxPager({
            maxPagesCount: 8,
            pageCount: 10,
            pageSizes: [7, 10, 13, 25],
            pageSize: 10,
            totalCount: 86,
            pagesCountText: "of"
        }),
        $pageSizeChooser,
        selectBox;

    $pager.data("dxPager").option("pageSize", 13);

    $pageSizeChooser = $pager.find(".dx-page-sizes").children().first();
    selectBox = $pageSizeChooser.data("dxSelectBox");

    assert.equal(selectBox.option("value"), 13);
});

QUnit.test("Light mode. Change page sizes via option method", function(assert) {
    var $pager = $("#container").width(PAGER_LIGHT_MODE_WIDTH).dxPager({
            maxPagesCount: 8,
            pageCount: 10,
            pageSizes: [7, 10, 13, 25],
            pageSize: 10,
            totalCount: 86,
            pagesCountText: "of"
        }),
        $pageSizeChooser,
        selectBox;

    $pager.data("dxPager").option("pageSizes", [13, 45, 67]);

    $pageSizeChooser = $pager.find(".dx-page-sizes").children().first();
    selectBox = $pageSizeChooser.data("dxSelectBox");
    selectBox.open();

    assert.deepEqual(selectBox.option("items"), [13, 45, 67]);

    selectBox.close();
});

QUnit.test("Light mode. Check page index", function(assert) {
    var $pager = $("#container").width(PAGER_LIGHT_MODE_WIDTH).dxPager({
            maxPagesCount: 8,
            pageCount: 10,
            totalCount: 86,
            pageIndex: 73,
            pagesCountText: "of"
        }),
        $pageIndex = $pager.find(".dx-page-index"),
        numberBox = $pageIndex.data("dxNumberBox");

    assert.equal(numberBox.option("value"), 73);
});

QUnit.test("Light mode. Check page index width", function(assert) {
    var $pager = $("#container").width(PAGER_LIGHT_MODE_WIDTH).dxPager({
            maxPagesCount: 8,
            pageCount: 10,
            totalCount: 86,
            pageIndex: 73,
            pagesCountText: "of"
        }),
        pager = $pager.data("dxPager"),
        $pageIndex = $pager.find(".dx-page-index"),
        numberBox = $pageIndex.data("dxNumberBox");

    assert.equal(numberBox.option("width"), Number($(".dx-page-index").css("min-width").replace("px", "")) + 20);

    pager.option("pageCount", 2070);

    assert.equal(numberBox.option("width"), Number($(".dx-page-index").css("min-width").replace("px", "")) + 40);
});

QUnit.test("Light mode. Change page index", function(assert) {
    var pageIndex,
        $pager = $("#container").width(PAGER_LIGHT_MODE_WIDTH).dxPager({
            maxPagesCount: 8,
            pageCount: 10,
            pageSizes: [5, 10, 20],
            pageSize: 5,
            totalCount: 86,
            pagesCountText: "of",
            pageIndexChanged: function(value) {
                pageIndex = value;
            }
        }),
        $pageIndex = $pager.find(".dx-page-index"),
        numberBox = $pageIndex.data("dxNumberBox");

    numberBox.option("value", 13);

    assert.equal(pageIndex, 13);
});

QUnit.test("Light mode. Change page index via option", function(assert) {
    var $pager = $("#container").width(PAGER_LIGHT_MODE_WIDTH).dxPager({
            maxPagesCount: 8,
            pageCount: 10,
            pageSizes: [5, 10, 20],
            pageSize: 5,
            totalCount: 86,
            pagesCountText: "of"
        }),
        $pageIndex = $pager.find(".dx-page-index"),
        numberBox = $pageIndex.data("dxNumberBox");

    $pager.data("dxPager").option("pageIndex", 79);

    assert.equal(numberBox.option("value"), 79);
});

QUnit.test("Light mode. Change page index via the navigation buttons", function(assert) {
    var pageIndex;

    $("#container").width(PAGER_LIGHT_MODE_WIDTH).dxPager({
        maxPagesCount: 8,
        pageCount: 10,
        pageSizes: [5, 10, 20],
        pageSize: 5,
        totalCount: 86,
        pagesCountText: "of",
        showNavigationButtons: true,
        pageIndexChanged: function(value) {
            pageIndex = value;
        }
    });

    var $nextButton = $(".dx-next-button"),
        $prevButton = $(".dx-prev-button");

    $nextButton.trigger("dxclick");

    assert.equal(pageIndex, 2, "next page index");

    $prevButton.trigger("dxclick");

    assert.equal(pageIndex, 1, "prev page index");
});

QUnit.test("Light mode. Min and max for the pageIndex editor", function(assert) {
    var pageIndex,
        $pager = $("#container").width(PAGER_LIGHT_MODE_WIDTH).dxPager({
            maxPagesCount: 8,
            pageCount: 10,
            pageSizes: [5, 10, 20],
            pageIndex: 2,
            pageSize: 5,
            totalCount: 86,
            pagesCountText: "of",
            pageIndexChanged: function(value) {
                pageIndex = value;
            }
        }),
        $input = $pager.find(".dx-page-index .dx-texteditor-input").first();

    $input.val(-12);
    $input.change();

    assert.equal(pageIndex, 1, "-12 value");

    $input.val(0);
    $input.change();

    assert.equal(pageIndex, 1, "0 value");

    $input.val(23);
    $input.change();

    assert.equal(pageIndex, 10, "23 value");
});

QUnit.test("Apply light mode when width of pager is less of min width", function(assert) {
    var $pager = $("#container").width(1000).dxPager({
            maxPagesCount: 8,
            pageCount: 10,
            pageSizes: [5, 10, 20],
            showInfo: true,
            totalCount: 86,
            infoText: "Page {0} of {1} ({2} items)",
            pagesCountText: "of",
            showNavigationButtons: true
        }),
        pager = $pager.data("dxPager");

    assert.equal(pager.option("lightModeEnabled"), false, "lightModeEnabled by default");
    assert.ok(!pager._isLightMode, "isLightMode");

    $pager.width(100);
    pager._dimensionChanged();

    assert.equal(pager.option("lightModeEnabled"), true, "lightModeEnabled is enabled");
});

QUnit.test("Apply light mode when width equal optimal pager's width", function(assert) {
    var $pager = $("#container").dxPager({
            maxPagesCount: 8,
            pageCount: 10,
            pageSizes: [5, 10, 20],
            showInfo: true,
            totalCount: 86,
            infoText: "Page {0} of {1} ({2} items)",
            pagesCountText: "of",
            showNavigationButtons: true
        }),
        optimalPagerWidth,
        pager = $pager.data("dxPager");

    optimalPagerWidth = pager._$pagesSizeChooser.width() + pager._$pagesChooser.width() + pager._pages[pager._pages.length - 1]._$page.width();

    $("#container").width(optimalPagerWidth - pager._$info.outerWidth(true) - 1);
    pager._dimensionChanged();

    assert.equal(pager.option("lightModeEnabled"), true, "lightModeEnabled is enabled");
});

QUnit.test("Apply light mode when pager is first rendered", function(assert) {
    var $pager = $("#container").width(100).dxPager({
            maxPagesCount: 8,
            pageCount: 10,
            pageSizes: [5, 10, 20],
            showInfo: true,
            totalCount: 86,
            infoText: "Page {0} of {1} ({2} items)",
            pagesCountText: "of",
            showNavigationButtons: true
        }),
        pager = $pager.data("dxPager");

    assert.equal(pager.option("lightModeEnabled"), true, "lightModeEnabled is enabled");
});

QUnit.test("Pager is rendered in a normal view after light mode when pageCount is changed", function(assert) {
    var $pager = $("#container").width(460).dxPager({
            maxPagesCount: 10,
            pageCount: 5,
            pageSize: 8,
            pageSizes: [5, 8, 15, 30],
            showInfo: true,
            totalCount: 40,
            infoText: "Page {0} of {1} ({2} items)",
            pagesCountText: "of",
            showNavigationButtons: true
        }),
        pager = $pager.data("dxPager");

    pager.option({ pageCount: 10, pageIndexChanged: $.noop });
    pager.option({ pageCount: 5, pageIndexChanged: $.noop });

    assert.ok(!pager.option("lightModeEnabled"), "pager is not displayed in the light mode");
});

QUnit.test("Light mode is applied only one", function(assert) {
    var $pager = $("#container").width(1000).dxPager({
            maxPagesCount: 8,
            pageCount: 10,
            pageSizes: [5, 10, 20],
            showInfo: true,
            totalCount: 86,
            infoText: "Page {0} of {1} ({2} items)",
            pagesCountText: "of",
            showNavigationButtons: true
        }),
        called = 0,
        pager = $pager.data("dxPager");

    pager.on("optionChanged", function(e) {
        if(e.name === "lightModeEnabled") {
            called++;
        }
    });

    $pager.width(995);
    pager._dimensionChanged();

    $pager.width(800);
    pager._dimensionChanged();

    $pager.width(100);
    pager._dimensionChanged();

    $pager.width(80);
    pager._dimensionChanged();

    assert.equal(called, 1);
});

QUnit.test("Cancel light mode when width of pager is more of min width", function(assert) {
    var $pager = $("#container").width(100).dxPager({
            maxPagesCount: 8,
            pageCount: 10,
            pageSizes: [5, 10, 20],
            showInfo: true,
            totalCount: 86,
            infoText: "Page {0} of {1} ({2} items)",
            pagesCountText: "of",
            showNavigationButtons: true
        }),
        pager = $pager.data("dxPager");

    assert.equal(pager.option("lightModeEnabled"), true, "lightModeEnabled is enabled");

    $pager.width(1000);
    pager._dimensionChanged();

    assert.equal(pager.option("lightModeEnabled"), false, "lightModeEnabled is disabled");
});

QUnit.test("Cancel light mode is only one", function(assert) {
    var $pager = $("#container").width(100).dxPager({
            maxPagesCount: 8,
            pageCount: 10,
            pageSizes: [5, 10, 20],
            showInfo: true,
            totalCount: 86,
            infoText: "Page {0} of {1} ({2} items)",
            pagesCountText: "of",
            showNavigationButtons: true
        }),
        called = 0,
        pager = $pager.data("dxPager");

    pager.on("optionChanged", function(e) {
        if(e.name === "lightModeEnabled") {
            called++;
        }
    });

    $pager.width(1000);
    pager._dimensionChanged();

    $pager.width(1005);
    pager._dimensionChanged();

    $pager.width(1010);
    pager._dimensionChanged();

    $pager.width(1200);
    pager._dimensionChanged();

    assert.equal(called, 1);
});

QUnit.test("Hide the info element when it does not fit in a container", function(assert) {
    var $pager = $("#container").width(1000).dxPager({
            maxPagesCount: 8,
            pageCount: 10,
            pageSizes: [5, 10, 20],
            showInfo: true,
            totalCount: 86,
            infoText: "Page {0} of {1} ({2} items)",
            pagesCountText: "of"
        }),
        pager = $pager.data("dxPager");

    $pager.width(pager._$pagesSizeChooser.width() + pager._$pagesChooser.width() - 50);
    pager._dimensionChanged();

    assert.ok(!pager.option("lightModeEnabled"), "lightModeEnabled");
    assert.equal(pager._$info.css("display"), "none", "info element is hidden");
});

QUnit.test("Show the info element when it is fit in a container", function(assert) {
    var $pager = $("#container").width(1000).dxPager({
            maxPagesCount: 8,
            pageCount: 10,
            pageSizes: [5, 10, 20],
            showInfo: true,
            totalCount: 86,
            infoText: "Page {0} of {1} ({2} items)",
            pagesCountText: "of"
        }),
        pager = $pager.data("dxPager"),
        infoWidth = pager._$info.width();

    $pager.width(pager._$pagesSizeChooser.width() + pager._$pagesChooser.width() - 50);
    pager._dimensionChanged();

    $pager.width(pager._$pagesSizeChooser.width() + pager._$pagesChooser.width() + infoWidth + 50);
    pager._dimensionChanged();

    assert.ok(!pager.option("lightModeEnabled"), "lightModeEnabled");
    assert.ok(pager._$info.css("display") !== "none", "info element is shown");
});

QUnit.test("LightMode.Prev button is disabled when first page is chosen ", function(assert) {
    var $pager = $("#container").dxPager({
            maxPagesCount: 8,
            pageCount: 10,
            pageSizes: [5, 10, 20],
            showNavigationButtons: true,
            pagesCountText: "of",
            lightModeEnabled: true
        }),
        isPageChanged,
        $button = $(".dx-prev-button"),
        instance = $pager.data("dxPager");

    instance.pageIndexChanged = function() {
        isPageChanged = true;
    };

    $button.click();

    assert.ok($button.hasClass("dx-button-disable"));
    assert.ok(!isPageChanged);
});

QUnit.test("LightMode.Next button is disabled when first page is chosen ", function(assert) {
    var $pager = $("#container").dxPager({
            maxPagesCount: 8,
            pageCount: 10,
            pageSizes: [5, 10, 20],
            showNavigationButtons: true,
            pagesCountText: "of",
            lightModeEnabled: true
        }),
        isPageChanged,
        $button,
        instance = $pager.data("dxPager");

    instance.option("pageIndex", 10);
    instance.pageIndexChanged = function() {
        isPageChanged = true;
    };

    $button = $(".dx-next-button");
    $button.click();

    assert.ok($button.hasClass("dx-button-disable"));
    assert.ok(!isPageChanged);
});

QUnit.test("Navigate buttons with rtl", function(assert) {
    var $pager = $("#container").dxPager({
            maxPagesCount: 8,
            pageCount: 10,
            pageSizes: [5, 10, 20],
            showNavigationButtons: true,
            rtlEnabled: true
        }),
        instance = $pager.data("dxPager"),
        $button,
        currentDirection;

    instance.option("pageIndex", 8);
    instance._nextPage = function(direction) {
        currentDirection = direction;
    };

    $button = $(".dx-next-button");
    $button.trigger("dxclick");
    assert.equal(currentDirection, "prev");

    $button = $(".dx-prev-button");
    $button.trigger("dxclick");
    assert.equal(currentDirection, "next");
});

QUnit.test("dxPager render with RTL", function(assert) {
    var pagerElement = $("#container").dxPager({
            maxPagesCount: 8,
            pageCount: 10,
            pageSizes: [5, 10, 20],
            showNavigationButtons: true,
            rtlEnabled: true
        }),
        pagerInstance = pagerElement.dxPager("instance"),
        rtlTestSample = {},
        ltrTestSample = {};

    rtlTestSample = {
        pageSizes: pagerElement.find(".dx-page-size").text(),
        pages: $(pagerElement.find(".dx-pages div").get().reverse()).text()
    };

    pagerInstance.option("rtlEnabled", false);

    ltrTestSample = {
        pageSizes: pagerElement.find(".dx-page-size").text(),
        pages: pagerElement.find(".dx-pages div").text()
    };

    assert.equal(rtlTestSample.pageSizes, ltrTestSample.pageSizes, "check that page sizes in LTR are equal to page sizes in RTL");
    assert.equal(rtlTestSample.pages, ltrTestSample.pages, "check that pages in LTR are equal to reversed pages in RTL");
});
